﻿<!doctype html>
<html class="no-js" lang="zxx"  xmlns:th="http://www.thymeleaf.org">
<!--房产-房产阶梯式显示-单个阶梯-->
<head th:replace="layout::head(${title},${desc})"></head>
<body>

<div id="main-wrapper">
   
    <!--Header section start-->
    <template th:replace="layout::header"></template>
    <!--Header section end-->
    
    <!--Page Banner Section start-->
    <div class="page-banner-section section">
        <div class="container">
            <div class="row">
                <div class="col">
                    <h1 class="page-banner-title">房产</h1>
                    <ul class="page-breadcrumb">
                        <li><a href="index.html">主页</a></li>
                        <li class="active">Properties Carousel</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!--Page Banner Section end-->

    <!--Feature property section start-->
    <div class="property-section section pt-100 pt-lg-80 pt-md-70 pt-sm-60 pt-xs-50 pb-100 pb-lg-80 pb-md-70 pb-sm-60 pb-xs-50">
        <div class="container">
            
            <div class="row">
               
                <!--Property Slider start-->
                <div class="property-carousel section">

                    <!--Property start-->
                    <div class="property-item col" th:each="property : ${propertiesAndRentTypeVOS}">
                        <div class="property-inner">
                            <div class="image">
                                <span class="label" th:text="${property.properties.isSpecial} == 0 ? '' : '特色' "></span>
                                <span class="label" th:text="${property.properties.isHot} == 0 ? '' : '热门'"></span>
                                <a href="single-properties.html"><img th:src="${property.properties.pictureUrl}" alt=""></a>
                                <ul class="property-feature">
                                    <li>
                                        <span class="area"><img src="assets/images/icons/area.png" alt="" th:text="${property.properties.square}"></span>
                                    </li>
                                    <li>
                                        <span class="bed"><img src="assets/images/icons/bed.png" alt="" th:text="${property.properties.roomNumber}"></span>
                                    </li>
                                    <li>
                                        <span class="bath"><img src="assets/images/icons/bath.png" alt="" th:text="${property.properties.bathroomNumber}"></span>
                                    </li>
                                    <li>
                                        <span class="parking"><img src="assets/images/icons/parking.png" alt="" th:text="${property.properties.garageNumber}"></span>
                                    </li>
                                </ul>
                            </div>
                            <div class="content">
                                <div class="left">
                                    <h3 class="title"><a href="single-properties.html" th:text="${property.properties.title}"></a></h3>
                                    <span class="location"><img src="assets/images/icons/marker.png" alt="" th:text="${property.properties.city}"></span>
                                </div>
                                <div class="right">
                                    <div class="type-wrap">
                                        <span class="price" th:text="${property.properties.price}"><span>月</span></span>
                                        <span class="type" th:text="${property.propertiesRentType.typeName}"></span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!--Property end-->
                </div>
                <!--Property Slider end-->
                
            </div>
            
        </div>
    </div>
    <!--Feature property section end-->
    
    <!--Footer section start-->
    <template th:replace="layout::footer"></template>
       
        <!--Footer Top start-->
        <div class="footer-top section pt-100 pt-lg-80 pt-md-70 pt-sm-60 pt-xs-50 pb-60 pb-lg-40 pb-md-30 pb-sm-20 pb-xs-10">
            <div class="container">
                <div class="row row-25">
                    
                    <!--Footer Widget start-->
                    <div class="footer-widget col-lg-3 col-md-6 col-12 mb-40">
                        <img src="assets/images/logo-footer.png" alt="">
                        <p>房产交易平台the best theme for elit, sed do to eiumod tempor dolor sit amet, ctetur adipiscing elit seddo dolor sit amet.</p>
                        <div class="footer-social">
                            <a href="#" class="facebook"><i class="fa fa-facebook"></i></a>
                            <a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
                            <a href="#" class="linkedin"><i class="fa fa-linkedin"></i></a>
                            <a href="#" class="google"><i class="fa fa-google-plus"></i></a>
                            <a href="#" class="pinterest"><i class="fa fa-pinterest-p"></i></a>
                        </div>
                    </div>
                    <!--Footer Widget end-->
                    
                    <!--Footer Widget start-->
                    <div class="footer-widget col-lg-3 col-md-6 col-12 mb-40">
                        <h4 class="title"><span class="text">联系我们</span><span class="shape"></span></h4>
                        <ul>
                            <li><i class="fa fa-map-o"></i><span>成都市高新区公兴保税区256号</span></li>
                            <li><i class="fa fa-phone"></i><span><a href="#">+012 345 678 102</a><a href="#">+012 345 678 101</a></span></li>
                            <li><i class="fa fa-envelope-o"></i><span><a href="#">info@example.com</a><a href="#">www.example.com</a></span></li>
                        </ul>
                    </div>
                    <!--Footer Widget end-->
                    
                    <!--Footer Widget start-->
                    <div class="footer-widget col-lg-3 col-md-6 col-12 mb-40">
                        <h4 class="title"><span class="text">友情链接</span><span class="shape"></span></h4>
                        <ul>
                            <li><a href="#">Rental Builidngs</a></li>
                            <li><a href="#">Browe all Categories</a></li>
                            <li><a href="#">Top Mortagages Rates</a></li>
                            <li><a href="#">RentalTerms of use</a></li>
                            <li><a href="#">Privacy Policy</a></li>
                       </ul>
                    </div>
                    <!--Footer Widget end-->    
                    
                    <!--Footer Widget start-->
                    <div class="footer-widget col-lg-3 col-md-6 col-12 mb-40">
                        <h4 class="title"><span class="text">通讯录</span><span class="shape"></span></h4>
                        
                        <p>添加我们的最新的通讯录，您会得到最新房产信息，并且得到最低折扣</p>
                        
                        <form id="mc-form" class="mc-form footer-newsletter" >
                            <input id="mc-email" type="email" autocomplete="off" placeholder="输入邮箱地址.." />
                            <button id="mc-submit"><i class="fa fa-paper-plane-o"></i></button>
                        </form>
                        <!-- mailchimp-alerts Start -->
                        <div class="mailchimp-alerts text-centre">
                            <div class="mailchimp-submitting"></div><!-- mailchimp-submitting end -->
                            <div class="mailchimp-success"></div><!-- mailchimp-success end -->
                            <div class="mailchimp-error"></div><!-- mailchimp-error end -->
                        </div><!-- mailchimp-alerts end -->
                        
                    </div>
                    <!--Footer Widget end-->
                    
                </div>
            </div>
        </div>
        <!--Footer Top end-->
        
        <!--Footer bottom start-->
        <div class="footer-bottom section">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="copyright text-center">
                            <p>Copyright &copy;2018 <a  href="http://www.xuetang9.com">老九学堂</a>. 版权所有.</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--Footer bottom end-->
        
     </footer>
     <!--Footer section end-->
</div>

<!-- Placed js at the end of the document so the pages load faster -->

<!-- All jquery file included here -->
<script src="http://ditu.google.cn/maps/api/js?sensor=false&libraries=geometry&v=3.22&key=AIzaSyDAq7MrCR1A2qIShmjbtLHSKjcEIEBEEwM"></script>
<script src="assets/js/vendor/jquery-1.12.4.min.js"></script>
<script src="assets/js/popper.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/plugins.js"></script>
<script src="assets/js/map-place.js"></script>
<script src="assets/js/main.js"></script>

</body>

</html>
